<template>
  <tr>
    <td>
      <input type="checkbox" v-model="goodsObj.checked">
    </td>
    <td>{{ goodsObj.name }}</td>
    <td>{{ goodsObj.price }}</td>
    <td>
      <button @click="decrease">-</button>
      {{ goodsObj.num }}
      <button @click="increase">+</button>
    </td>
    <td>{{ totalPrice }}</td>
    <td>
      <button @click="del">删除</button>
    </td>
  </tr>
</template>

<script>
export default {
  // props: ['goodsObj', 'index']
  props: {
    // 父传子的商品对象
    goodsObj: {
      type: Object, // 类型
      required: true, // 必传
      // default: () => {}  // 默认值
    },
    // 下标
    index:  Number
  },
  computed: {
    // 当前商品总价
    totalPrice() {
      return this.goodsObj.price * this.goodsObj.num
    }
  },
  methods: {
    // -
    decrease() {
      if(this.goodsObj.num <= 1) return
      this.goodsObj.num--
    },
    // +
    increase() {
      this.goodsObj.num++
    },
    // 删除
    del() {
      this.$emit('del', this.index)
    }
  }
}
</script>

<style>

</style>